<template>
	<!-- <div id="app"> -->
	<!-- <div style="width: 100px; height: 50px; border: 1px solid slategray;"> -->
	<!-- <Item :isActive="curActive === 'dianjing'" @active = "curActive = 'dianjing'"> -->
	<!-- 绑定的动态属性isActive首先进行判断：curActive是否为对应值，也就是在判断该元素是否被选中 -->
	<!-- 如果isActive === curActive则isActive结果为true，反之为false，结果将返回到Item.vue中 -->
	<!-- 对应的class中active结果为true或false，则会渲染被选中或者未被选中的状态，也就是Item.vue中的active样式 -->
	<!-- 其中绑定的@active函数是将选中元素的curActive值变为对应值，并传到Item.vue子组件中进行以上步骤，已达到点击选中的效果 -->
	<!-- 电竞 -->
	<!-- </Item> -->
	<!-- </div> -->
	<!-- <div style="width: 100px; height: 50px; border: 1px solid slategray;"> -->
	<!-- <Item :isActive="curActive === 'dongman'" @active = "curActive = 'dongman'"> -->
	<!-- 动漫 -->
	<!-- </Item> -->
	<!-- </div> -->
	<!-- <img alt="Vue logo" src="./assets/logo.png"> -->
	<!-- <HelloWorld msg="Welcome to Your Vue.js App"/> -->
	<!-- </div> -->
	<!--  <TitleMune :isActive = "curActive === 'faxian'" @active = "curActive = 'faxian'">
  </TitleMune> -->
	<!-- <div id="app" style="width: 250px;"> -->
		<!-- <channelsSearch></channelsSearch> -->
		<!-- 这个是channelsSearch频道搜索组件 -->
		<!-- <TitleMenu :isActive="activeId === 100" @active="activeId = 100"> -->
			<!-- <template v-slot:title> -->
				<!-- v-slot:title是将这里的值传给TitleMenu中名为title的插槽 -->
				<!-- 发现频道 -->
			<!-- </template> -->
			<!-- <template v-slot:icon> -->
				<!-- v-slot:icon是将这里的值传给TitleMenu中名为icon的插槽 -->
				<!-- > -->
			<!-- </template> -->
		<!-- </TitleMenu> -->
		<!-- <Channel :data="{name:'动漫',channel_count:'222'}"></Channel> -->
		<!-- 首先接收子组件传来的事件，将activeId数据传递给子组件进行判断 -->
		<!-- <channelList :columns="2" :activeId="activeId" @active="activeId = $event"></channelList> -->
	<!-- </div> -->
<!-- 	<div>
		<AsideComp style="width: 250px; height: 500px;"></AsideComp>
	</div> -->
	<Channels></Channels>
</template>

<script>
	// 关系：App-->TitleMenu-->Item
	import Channels from './pages/Channels.vue'
	// import Channel from './components/channel.vue'
	export default {
		components: {
			Channels
			// AsideComp
			// Channel,
		},
		// methods:{
		// 	handleSearch(e){
		// 		// 这里的e是接收到search.vue传过来的值，也就是input中输出搜索的值，并将其打印出来测试
		// 		console.log("执行了一次搜索",e)
		// 	}
		// },
		// data() {
		// 	return {
		// 		select: false, //true或者false赋值的时候不能加引号，否则会报错
		// 		activeId: 100

		// 	}
		// }
	}
</script>
<!-- 
<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
 -->
